body { 
 background-color: #fff;  
    color: #222; 
    font-size: 14px;
    margin: 0; 
    padding: 0;  
    font-family:Lato,Arial;
    overflow:auto;
}

header {
    display:block;
    max-width: 1024px;
}

.article-menu {
    cursor:pointer;
    float:left;
    padding : 4px 4px 0px 4px;
    font-size: 14pt;
}

.main {
    margin: 0px 2px 2px 0px; 
    overflow: hidden;
    -webkit-border-top-left-radius: 8px; 
}

.top-right {
    float : right
}    

.controller {
    position : absolute;
    width : 500px;
    height : 200px;
    background : #ffe;
    border : solid 1px #999;
    padding : 0px; 
}

.controller div {
    margin  : 0px; 
}

.controller p {
    padding : 4px;
    margin  : 4px;
}      


.info {
    width: 250px;
    height: 140px;
    background : #ffc;
    margin: 0px 1px 1px 0px;
    padding : 0px;
    overflow: hidden;
}

#dialog {
    display : none;
   list-style-type: none; 
}


#dialogs li {
   list-style-type: none; 
   margin : 1px 1px 0px 0px; 
    padding : 0px;  
    font-family:Lato,Arial;
    font-size : 10pt;  
    border-bottom : solid 1px #ccc;
}


a { color : #00f; }
a:hover { color : #f41; }

#div-stat {
    text-align:center;
    padding : 4px;
    width : 97%; 
     
}

.splash{
    float:left;
}
.link {
    width : 200px; 
    overflow: hidden;
    text-overflow:ellipsis;
}

.column1 {
    position : absolute;
    text-align:right;
    width : 120px;
    left : 35%;
}

.column2 {
    position : absolute;
    left : 55%;
}
.group-join {
    color : #00f;
    text-decoration:underline;
    cursor : pointer;
}

.group-name {
    cursor : pointer;
    color : #00f;
    list-style-type: none; 
    width : 98%;
}
#dialog ul
{
    padding : 0px;
    margin  : 0px;
}

.group-name a.list-item, #dialog li {
    background-color: #FFFFFF;
    border: 1px solid #999999;
    color: #222222;
    display: block;
    font-size: 12pt; 
    margin-bottom: -1px;
    padding: 4px 10px;
    text-decoration: none;
}  

li.group-name:first-child a.list-item, #dialog li:first-child {
    -webkit-border-top-left-radius: 8px;
    -webkit-border-top-right-radius: 8px;
}

li.group-name:last-child a.list-item, #dialog li:last-child {
    -webkit-border-bottom-left-radius: 8px;
    -webkit-border-bottom-right-radius: 8px;
}


.article-preview {
    width : 40px;
    height : 40px;
     overflow : hidden;
    font-size : 9pt;
}
.article-wmv, .article-rar {
    color :#333;
}

.scroll {
    position : fixed;
    top :  48px;
    left : 8px;
    border : solid 1px #999;
     overflow : hidden; 
    height : 588px;  
    width : 1008px;  
   background : #fff;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5); 
}
.rounded { 
    padding : 0px 12px 0px 12px; 
    margin : 2px;  
}

.arrow {
   list-style-type: none; 
   float : left;
   width : 242px;
   height : 242px;
   overflow : hidden;
   margin : 2px 2px 0px 0px; 
    padding : 0px;  
    font-family:Lato,Arial;
    font-size : 9pt;  
}

.arrow, .bookmark {
   cursor : pointer;
}

.datarow {
    border-bottom : solid 1px #ccc;
    font-family:Lato,Arial;
    font-size : 10pt;
    font-weight : 300;
}

.pre-thumb {

  width : 230px;
  height : 230px;
   margin : 0px;  

}

.float {
    position : fixed;
    top :  48px;
    left : 10px; 
  height : 100%;
}

.toolbar .back, .toolbar .next {
    cursor : pointer;
    position : fixed;
    top :  4px;
    left : 10px;
    padding : 2px 6px 4px 6px;
/*
    text-decoration:none;
    border: solid 1px #333;
    background:#eee;

    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -o-border-radius: 6px;
    border-radius: 6px;*/
}

.toolbar .next {
    left : 92%;
}


#header h1 {
    margin: 0;
    padding: 0; 
}

#header h1 a {
    background-color: #ccc;
    border-bottom: 1px solid #666;
    color: #222;
    display: block;
    font-size: 20px;
    font-weight: bold;
    padding: 10px 0;
    text-align: center;
    text-decoration: none;


}


.roundButton, #header div.leftButton, #header div.rightButton {
    height: 30px;
    font-weight: bold;
    text-align: center;
    color: white;
    text-shadow: rgba(0,0,0,0.6) 0px -1px 0px;
    line-height: 28px;
    border-width: 0 8px 0 8px;
    -webkit-border-image: url(/images/button.png) 0 8 0 8;
}


#header div.leftButton, #header div.rightButton {
   cursor : pointer;
    position: absolute; 
    top: 7px;
    left: 6px;

}

#header div.rightButton {
    left : 92%;
}

a.next, a.back {
	/* styles for button */ 
	text-align:center;
	background: #0031e3;
	display: block;  
	text-decoration: none; 
	line-height: 1;
        color : #fff; 
	
	/* css3 implementation :) */
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
	border-bottom: 1px solid rgba(0,0,0,0.25); 
	cursor: pointer;
	
}

a.next:hover {
	background-color: #c33100;	
}
 

.datarow a {
    text-decoration: none;
    color : #000;
}

.datarow a:hover {
    text-decoration: underline;
    color : #666;
}

.article-tiny, .article-hilo {
    font-size : 8pt;
    width     : 64px;
    height    : 64px;
    float     : left;
    overflow  : hidden;
     margin : 1px 1px 0px 0px; 
    padding : 0px;  
    cursor : pointer;
}

}

.article-tiny 
{
    width     : 52px;
    height    : 52px;
}


#article-select {
   font-size:9pt;
    font-family:Lato,Arial;
}

#video-container {
    width: 640px;
    height: 365px;
    position: relative;
}
 
button {
    background: rgba(0,0,0,.5);
    border: 0;
    color: #EEE;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
}

button:hover {
    cursor: pointer;
}
.ui-dialog, .ui-dialog-titlebar, .ui-dialog-title, .ui-dialog-titlebar-close {
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    -o-border-radius: 0px;
    border-radius: 0px;
}
.ui-dialog-titlebar {
    background : royalblue;
    font-family:Lato,Arial;
    font-weight:400;

    margin : 0 auto;
    padding : 0px 0;
   max-width:640px;
   overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
display:none;
}
.ui-dialog-content
{
    font-family:Lato,Arial;
    font-weight:300;
}
.ui-widget-content.ui-dialog {
    border: 2px solid royalblue;
}

 .ui-progressbar {
    position: relative;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    -o-border-radius: 0px;
    border-radius: 0px; 
  }

  .msmq-id {
    position: absolute;
    left: 5%;
    width : 90%;
    top: 8px; 
    text-align:center;
    font-family:Lato,Arial;
    font-weight:400;
    font-size : 9pt;
    text-shadow: 1px 1px 0 #fff;

/*
    margin : 0 auto;
    padding : 0px 0;
   max-width:640px;
   overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
*/
  }



.article-wmv, .article-m4v {
    color : #333;
    background: #ccf url();
    background-repeat:no-repeat;
    background-position:73px 73px;
}

.article-rar {
    background: #ccf url();
background-repeat:no-repeat;
background-position:73px 73px;
}

